<template>
  <view class="container">
    <view class="userinfo-card">
      <view class="card-box" @tap="go_with">
        <view class="balance-card-wrap">
          <view class="balance-card">
            <view class="tit">可提现金额(元)</view>
            <view class="xia">
              <view class="num">
                <text style="font-size: 40upx">￥</text
                >{{ mch_info.balance ? mch_info.balance : 0 }}
              </view>
              <view class="withdraw-btn">立即提现</view>
            </view>
          </view>
        </view>
      </view>
    </view>
    <view class="main">
      <view class="income-card" style="margin-top: 0upx">
        <view class="tit">
          <text>我的订单</text>
          <!-- <image src="@/static/right_icon.png" mode=""></image> -->
        </view>
        <u-grid :col="3" :border="false">
          <u-grid-item @tap="go_orderList('0')">
            <view class="num">{{ count_unpay ? count_unpay : 0 }}</view>
            <view class="grid-text">待付款></view>
          </u-grid-item>
          <u-grid-item @tap="go_orderList('1')" v-if="mch_info.org_type == 1">
            <view class="num">{{ count_unsend ? count_unsend : 0 }}</view>
            <view class="grid-text">待消费></view>
          </u-grid-item>
          <u-grid-item @tap="go_orderList('1')" v-else>
            <view class="num">{{ count_unsend ? count_unsend : 0 }}</view>
            <view class="grid-text">待发货></view>
          </u-grid-item>
          <u-grid-item @tap="go_orderList('4')">
            <view class="num">{{ count_reback ? count_reback : 0 }}</view>
            <view class="grid-text">退货/售后></view>
          </u-grid-item>
        </u-grid>
        <u-grid :col="3" :border="false">
          <u-grid-item @tap="go_orderList2('1')">
            <view class="num">{{ un_settle_money | toFixed2 }}</view>
            <view class="grid-text">待结算></view>
          </u-grid-item>
          <u-grid-item>
            <view class="num" @tap="go_orderList2('2')">{{
              settle_money | toFixed2
            }}</view>
            <view class="grid-text">已结算></view>
          </u-grid-item>
        </u-grid>
      </view>
      <view class="income-card" style="margin-top: 0upx">
        <view class="tit">
          <text>收益分析</text>
        </view>
        <u-grid :col="2" :border="false">
          <u-grid-item>
            <view class="num">{{
              yes_money.commission_price ? yes_money.commission_price : 0
            }}</view>
            <view class="grid-text">昨日预估净收入</view>
          </u-grid-item>
          <u-grid-item>
            <view class="num">{{ count_unsend ? count_unsend : 0 }}</view>
            <view class="grid-text">昨日预估分佣</view>
          </u-grid-item>
          <u-grid-item>
            <view class="num">{{
              today_money.act_price
                ? today_money.act_price - today_money.commission_price
                : 0
            }}</view>
            <view class="grid-text">今日预估净收入</view>
          </u-grid-item>
          <u-grid-item>
            <view class="num">{{
              today_money.commission_price ? today_money.commission_price : 0
            }}</view>
            <view class="grid-text">今日预估分佣</view>
          </u-grid-item>
        </u-grid>
      </view>
    </view>
  </view>
</template>

<script>
import {
  uc_info,
  mch_settle_data,
  orders_money_day,
  order_census,
} from "../../utils/imapi";
export default {
  props: {},
  components: {},
  data() {
    return {
      show_money: false,
      mch_info: {}, // 商家信息
      count_unpay: 0, // 待付款数量
      count_unsend: 0, // 代发货
      count_reback: 0, // 退货数量
      today_money: {}, // 今日金额
      yes_money: {}, // 昨日金额
      un_settle_money: 0,
      settle_money: 0,
    };
  },
  computed: {},
  watch: {},
  onLoad() {
    this.query_mch_info();
    this.query_order_info("0");
    this.query_order_info("1");
    this.query_order_info("4");
    this.query_money_info();
    this.query_money_info1();
    this.settle_money_func();
  },
  onReady() {},
  onShow() {},
  methods: {
    go_orderList(status) {
      uni.navigateTo({
        url: "/pages/order_list/order_list?status=" + status,
      });
    },
    go_orderList2(status) {
      uni.navigateTo({
        url: "/pages/order_list/order_list?status1=" + status,
      });
    },
    go_with() {
      uni.navigateTo({
        url: "/pages/balance_page/balance_page",
      });
    },
    async query_mch_info() {
      const data = await uc_info();
      console.log(data);
      this.mch_info = data.data;
    },
    // 查询商家订单量统计
    async query_order_info(status) {
      const { data } = await order_census({
        order_status: status,
      });
      if (status == "0") {
        this.count_unpay = data.cnt;
      } else if (status == "1") {
        this.count_unsend = data.cnt;
      } else if (status == "4") {
        this.count_reback = data.cnt;
      }
    },
    // 查询商家昨天的状态金额统计
    async query_money_info1() {
      const t = new Date();
      const yes_t = t.getTime() - 24 * 60 * 60 * 1000;
      const yes_date = new Date(parseInt(yes_t));
      const y = yes_date.getFullYear();
      const m = yes_date.getMonth() + 1;
      const d = yes_date.getDate();
      const date = y + "-" + m + "-" + d;
      const { data } = await orders_money_day({
        status_group: "1",
        time_str: date,
      });
      this.yes_money = data;
    },
    // 查询商家今天的状态金额统计
    async query_money_info() {
      const t = new Date();
      const y = t.getFullYear();
      const m = t.getMonth() + 1;
      const d = t.getDate();
      const date = y + "-" + m + "-" + d;
      const { data } = await orders_money_day({
        status_group: "1",
        time_str: date,
      });
      this.today_money = data;
    },
    async settle_money_func() {
      const { data } = await mch_settle_data();
      this.un_settle_money = data.un_settle_money;
      this.settle_money = data.settle_money;
    },
  },

  onReachBottom() {},
  onHide() {},
};
</script>

<style scoped lang="scss" scoped>
page {
  background: #f2f3f7;
}

.container {
  .userinfo-card {
    .card-box {
      width: 100%;
      position: relative;
      z-index: 0;
      padding-top: 40rpx;
      .balance-card-wrap {
        width: 100%;
        height: 200upx;
        padding: 0 20upx;
        .balance-card {
          width: 100%;
          height: 200upx;
          background: linear-gradient(90deg, #fddeb8 0%, #f9c378 100%);
          border-radius: 20upx;
          padding: 30upx;

          .tit {
            font-size: 32upx;
            font-family: PingFang SC;
            font-weight: bold;
            color: #754202;
          }

          .xia {
            width: 100%;
            display: flex;
            justify-content: space-between;

            .num {
              font-size: 70upx;
              font-family: DINPro;
              font-weight: bold;
              color: #754202;
            }

            .withdraw-btn {
              width: 150upx;
              height: 60upx;
              line-height: 60upx;
              text-align: center;
              background: #3b3533;
              font-size: 28upx;
              font-family: PingFang SC;
              font-weight: 500;
              color: #f9c378;
              border-radius: 10upx;
            }
          }
        }
      }
    }
  }

  .main {
    padding: 20upx;

    .income-card {
      width: 100%;
      background-color: #fff;
      border-radius: 20upx;
      padding: 30upx 0 0;
      margin-top: 20upx;
      overflow: hidden;
      margin-bottom: 20rpx;

      .tit {
        padding-left: 30rpx;
        display: flex;
        align-items: center;
        justify-content: space-between;
        font-size: 32upx;
        line-height: 32upx;
        font-family: PingFang SC;
        font-weight: bold;
        color: #333333;

        image {
          width: 10upx;
          height: 21upx;
        }
      }
      .num {
        font-size: 38upx;
        font-family: PingFang SC;
        font-weight: 800;
        color: #333333;
      }

      .grid-text {
        font-size: 24upx;
        font-family: PingFang SC;
        font-weight: 500;
        color: #999999;
      }
    }
  }
}
</style>
